<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title></title>
    <!--====== Favicon Icon ======-->
    <link rel="shortcut icon" href="/images/favicon.png" type="image/png">

    <!--====== Bootstrap CSS ======-->
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <!--====== default CSS ======-->
    <link rel="stylesheet" href="/css/default.css">
    <!--====== Style CSS ======-->
    <link rel="stylesheet" href="/css/style.css">
    <!-- login css -->
    <link rel="stylesheet" href="/css/login.css">
</head>
<body>
    <div class="container">
        <div class="all">
            <div class="row">
                <div class="log col-lg-6 col-xs-12">
                    <div class="register">
                        <form id="myForm">
                            <div class="register-top-grid">
                                <h3>用户登录</h3>
                                <div class="input">
                                    <span>手机号 <label style="color: red">* </label></span>
                                    <input type="text" id="phone" placeholder="请输入手机号" class="input-text"/>
                                </div>
                                <div class="input">
                                    <span>密码 <label style="color: red">*</label></span>
                                    <input type="password" id="password" placeholder="请输入密码" class="input-text" />
                                </div>
                            </div>
                            <div class="text-center">
                                <input type="submit" value="登 陆" class="tijiao"/>
                                <a th:href="@{/}"><input type="button" value="返回首页" class="back"/></a>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="reg col-lg-6 col-xs-12">
                    <div class="reg_1">
                        <h2>没有报名？</h2>
                        <p>欢迎参加AI+应用创新设计大赛，期待您的加入！</p>
                        <a th:href="@{/uis/registerUI}">
                            <button type="primary" class="sig">注册</button>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Javascript files-->
    <script src="/js/jquery-1.12.4.min.js"></script>
    <script src="/js/sweetalert.min.js"></script>
    <script src="/js/common.js"></script>
    <script>
        $(document).ready(function(){
            $('#myForm').submit(function(event){
                event.preventDefault();
                const phone = $('#phone').val();
                const password = $('#password').val();

                if(phone == '' || password == ''){
                    swal({
                        text: '手机号或密码不能为空！'
                    });
                }else{
                    const formData = {
                        phone: phone,
                        password: password
                    };
                    $.ajax({
                        type: 'POST',
                        url: '/login',
                        data: formData,
                        dataType: 'json',
                        success: function(data) {
                            if(data.message!=null){
                                swal({
                                    text: data.message,
                                    icon: 'error'
                                });
                            }else{
                                window.location.href = '/main';
                            }
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            console.log('Error: ');
                        }
                    });
                }
            })
        })
    </script>
</body>
</html>